<%--
  Created by IntelliJ IDEA.
  User: 左宏
  Date: 2020/9/29
  Time: 9:28
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%
    String path=request.getContextPath()+"/";

%>
<html>
<head>
    <title>授课管理</title>
    <link rel="stylesheet" href="<%=path%>static/css/bootstrap.min.css">
    <link href="<%=path%>static/css/font-awesome.css?v=4.4.0" rel="stylesheet">
    <!-- Data Tables -->
    <link href="<%=path%>static/css/plugins/dataTables/dataTables.bootstrap.css" rel="stylesheet">
    <link href="<%=path%>static/css/animate.css" rel="stylesheet">
    <link href="<%=path%>static/css/style.css?v=4.1.0" rel="stylesheet">
    <link href="<%=path%>static/css/plugins/layui/css/layui.css">
</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>${who}的课表</h5>
                </div>
                <div class="ibox-content">
                    <div>
                        <form id="form-date-class">
                            <input name="op" hidden="hidden" value="${op}">
                            <div style="width: 200px">
                                选择日期：<br>
                                <input type="date"class="form-control"   id="dateInput" name="date">
                            </div>
                            <c:if test="${fn:contains(sessionScope.roles,'教务主任') and op==0}">
                            <div style="width: 200px">
                                选择班级：
                                <div class="input-group" >
                                    <input type="text" class="form-control" id="classInput" name="aClass">
                                    <div class="input-group-btn">
                                        <button id="classBtn" type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
                                            &nbsp;<span class="caret"></span>
                                        </button>
                                        <ul class="dropdown-menu dropdown-menu-left" role="menu">
                                        </ul>
                                    </div>
                                </div>
                            </div>
                            </c:if>
                        </form>
                        <c:if test="${fn:contains(sessionScope.roles, '教务主任') or fn:contains(sessionScope.roles,'班主任') or fn:contains(sessionScope.roles,'任课教师' )}">
                            <button id="operation" class="btn btn-primary" onclick="showButton('.heihei')">操作</button>
                        </c:if>
                        <button id="outTable" class="btn btn-primary" onclick="printTimeTable()">导出课表</button>
                    </div>
                    <table class="table table-bordered table-hover " id="">
                        <thead>
                        <tr id="week">
                            <c:forEach var="i" begin="0" end="${fn:length(dates)-1}" step="1">
                                <c:if test="${i==0}">
                                    <td style="border: none"></td>
                                </c:if>
                                <td id="week${i}" value="${i}" style="border: none">${dates[i]}</td>
                            </c:forEach>
                        </tr>
                        <tr>
                            <th style="border: none"></th>
                            <th>周一</th>
                            <th>周二</th>
                            <th>周三</th>
                            <th>周四</th>
                            <th>周五</th>
                            <th>周六</th>
                            <th>周日</th>
                        </tr>
                        </thead>
                        <tbody>
                        <c:forEach var="j" begin="0" end="${fn:length(records[0])-1}" step="1">
                            <tr>
                                <td><h3>${j+1}</h3></td>
                                <c:forEach var="i" begin="0" end="${fn:length(records)-1}" step="1">
                                    <c:if test="${records[i][j]==null }">
                                        <td id="${j*7+i}">
                                            <c:if test="${fn:contains(sessionScope.permissions,'添加课程')}">
                                                <c:if test="${op==0}">
                                                <button  onclick="addCell(${i},${j})" hidden="hidden" class="btn btn-primary heihei">增加</button>
                                                </c:if>
                                            </c:if>
                                        </td>
                                    </c:if>
                                    <c:if test="${records[i][j]!=null }">
                                        <td id="r${records[i][j].id}">
                        <span>
                        课程名称：${records[i][j].course}<br>
                        任课教师：${records[i][j].teacher}<br>
                        班级：${records[i][j]._class}<br>
                        教室：${records[i][j].classroom}<br>
                                    <c:if test="${op==0}">
                                        <c:if test="${fn:contains(sessionScope.permissions,'修改课程')}">
                            <button hidden="hidden" class="btn btn-primary heihei" onclick="changeCell(${records[i][j].id})">修改</button>
                                        </c:if>
                                        <c:if test="${fn:contains(sessionScope.permissions,'修改课程')}">
                            <button hidden="hidden" class="btn btn-primary heihei" onclick="removeCell(${records[i][j].id})">移除</button>
                                        </c:if>
                                    </c:if>
                                        <c:if test="${fn:contains(sessionScope.permissions,'修改课程')}">
                            <button hidden="hidden" class="btn btn-primary heihei" onclick="adjustCell(${records[i][j].id})">调整</button>
                                        </c:if>
                        </span>
                                        </td>
                                    </c:if>
                                </c:forEach>
                            </tr>
                            <c:if test="${j==0}">
                                <tr>
                                    <td colspan="8" style="text-align: center;height: 75px"><h3>中午休息</h3></td>
                                </tr>
                            </c:if>
                            <c:if test="${j==1}">
                                <tr>
                                    <td colspan="8" style="text-align: center;height: 75px"><h3>下午休息</h3></td>
                                </tr>
                            </c:if>
                        </c:forEach>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <!-- 全局js -->
    <script src="<%=path%>static/js/jquery.min.js?v=2.1.4"></script>
    <script src="<%=path%>static/js/bootstrap.min.js?v=3.3.6"></script>
    <script src="<%=path%>static/js/plugins/jeditable/jquery.jeditable.js"></script>
    <script src="<%=path%>static/css/plugins/layui/layui.all.js"></script>
    <!-- Data Tables -->
    <script src="<%=path%>static/js/plugins/dataTables/jquery.dataTables.js"></script>
    <script src="<%=path%>static/js/plugins/dataTables/dataTables.bootstrap.js"></script>
    <!-- 自定义js -->
    <script src="<%=path%>static/js/content.js?v=1.0.0"></script>
<%--    suggest--%>
    <script src="<%=path%>static/js/plugins/suggest/bootstrap-suggest.min.js"></script>

<script>
    var FFF=false;
    $(function(){
        var layer=layui.layer;
        $(".heihei").each(function(i,e){
            $(e).hide();
        });
        let dateInput=$("#dateInput");
        let classInput=$("#classInput");
        dateInput.val("${dateStr}");
        classInput.val("${classStr}");
        dateInput.on("change",function(){
            if(classInput.val()==="")return;
            let form=$("#form-date-class");
            form.action="education/teaching/getTimetable";
            form.method="post";
            form.target="_self";
            form.submit();
        });
        classInput.bsSuggest({
            url: "searchKeyWord?keyI=_class&keyWord=",
            keyField: "_class"
        }).on('onSetSelectValue', function (e, keyword) {
            console.log('onSetSelectValue: ', keyword);
            if(dateInput.val()==="")return;
                let form=$("#form-date-class");
                form.action="education/teaching/getTimetable";
                form.method="post";
                form.target="_self";
                form.submit();
        });
    });
    function showButton(str){
        let oper=$("#operation");
        if(oper.text()==="操作"){
            FFF=true;
            oper.text("关闭操作");
        }else {
            oper.text("操作");
            FFF=false;
        }
        $(str).each(function(i,e){
            if($(e).is(":hidden"))$(e).show();
            else $(e).hide();
        });
    }
    function printTimeTable(){
        if(FFF)return;
        let hh1=$("#dateInput");
        let hh2=$("#classInput");
        let hh3=$("#operation");
        let hh4=$("#outTable");
        let hh5=$("#classBtn");
        $(hh1).hide();
        $(hh2).hide();
        $(hh3).hide();
        $(hh4).hide();
        $(hh5).hide();
        window.print();
        $(hh1).show();
        $(hh2).show();
        $(hh3).show();
        $(hh4).show();
        $(hh5).show();
    }
    //行列ij组成的id标识
    function addCell(i,j){
        let td=$("<form id='form-add"+(j*7+i)+"'>" +
            "课程名称：" +
            "<div class='input-group' >"+
            "<input type='text' class='form-control'id='courseInputA"+(j*7+i)+"' name='course'>"+
            "<div class='input-group-btn'>"+
            "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
            "&nbsp;<span class='caret'></span>"+
            "</button>"+
            "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
            "</ul>"+
            "</div>"+
            "</div>"+
            "任课教师：" +
            "<div class='input-group' >"+
            "<input type='text' class='form-control'id='teacherInputA"+(j*7+i)+"' name='teacher'>"+
            "<div class='input-group-btn'>"+
            "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
            "&nbsp;<span class='caret'></span>"+
            "</button>"+
            "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
            "</ul>"+
            "</div>"+
            "</div>"+
            "班级：" +
            "<input type='text' class='form-control'id='aClassInputA"+(j*7+i)+"' name='_class'>"+
            "教室：" +
            "<div class='input-group' >"+
            "<input type='text' class='form-control'id='classroomInputA"+(j*7+i)+"' name='classroom'>"+
            "<div class='input-group-btn'>"+
            "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
            "&nbsp;<span class='caret'></span>"+
            "</button>"+
            "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
            "</ul>"+
            "</div>"+
            "</div>"+
            "<input id='add-sure"+(j*7+i)+"'  class='btn btn-primary' type='button' value='确定'/>" +
            "<input id='add-cal"+(j*7+i)+"'  class='btn btn-primary' type='button' value='取消'/>"+
            "</form>");

        $("#"+(j*7+i)).html(td);
        $("#courseInputA"+(j*7+i)).bsSuggest({
            url: "searchKeyWord?keyI=course&keyWord=",
            keyField: "course",
        });
        $("#teacherInputA"+(j*7+i)).bsSuggest({
            url: "searchKeyWord?keyI=teacher&keyWord=",
            keyField: "teacher",
        });
        let aClassInputA=$("#aClassInputA"+(j*7+i));
        $(aClassInputA).val("${classStr}");
        $(aClassInputA).prop("readonly",true);
        $("#classroomInputA"+(j*7+i)).bsSuggest({
            url: "searchKeyWord?keyI=classroom&keyWord=",
            keyField: "classroom",
        });
        $("#add-sure"+(j*7+i)).on("click",function () {
            let formData=$("#form-add"+(j*7+i)).serializeArray();
            let date=$("#week"+i).text();
            formData.push({"name":"date","value":date});
            formData.push({"name":"index","value":j});
            $.ajax({
                type:"post",
                url:"addRecord",
                dateType:'json',
                data:formData,
                success:function(data){
                    if(data.code===0){
                        layer.msg(data.msg,{icon:1,time:1000},function () {
                            let td=$("<span>" +
                                "课程名称："+formData[0].value+"<br>"+
                                "任课教师：" +formData[1].value+"<br>"+
                                "班级：" +formData[2].value+"<br>"+
                                "教室：" +formData[3].value+"<br>"+
                                "</span>" +

                                "<c:if test='${op==0}'>"+
                                "<c:if test='${fn:contains(sessionScope.permissions,"修改课程")}'>" +
                                "<button  class='heihei btn btn-primary' onclick='changeCell("+data.id+")'>修改</button>" +
                                "</c:if>" +
                                "<c:if test='${fn:contains(sessionScope.permissions,"移除课程")}'>" +
                                "<button  class='heihei btn btn-primary' onclick='removeCell("+data.id+")'>移除</button>"+
                                "</c:if>"+
                                "</c:if>"+
                                "<c:if test='${fn:contains(sessionScope.permissions,"调整课程")}'>" +
                                "<button class='heihei btn btn-primary' onclick='adjustCell("+data.id+")'>调整</button>" +
                                "</c:if>"
                            );
                            let tdtd=$("#"+(j*7+i))
                            tdtd.html(td);
                            tdtd.attr("id","r"+data.id);
                        });
                    }
                }
            });
        });
        $("#add-cal"+(j*7+i)).on("click",function(){
            $("#"+(j*7+i)).html("<button  onclick='addCell("+i+","+j+")'  class='heihei btn btn-primary'>增加</button>")
        });
    }
    function changeCell(id){
        $.ajax({
            type:'get',
            url:'getRecord',
            dataType:'json',
            data:{id:id},
            success:function(data){
                if(data.code===0){
                    let record=data.record;
                    let td=$("<form id='form-change"+id+"'>" +
                        "课程名称：" +
                        "<div class='input-group' >"+
                        "<input type='text' class='form-control'id='courseInputC"+id+"' name='course'>"+
                        "<div class='input-group-btn'>"+
                        "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
                        "&nbsp;<span class='caret'></span>"+
                        "</button>"+
                        "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
                        "</ul>"+
                        "</div>"+
                        "</div>"+
                        "任课教师：" +
                        "<div class='input-group' >"+
                        "<input type='text' class='form-control'id='teacherInputC"+id+"' name='teacher'>"+
                        "<div class='input-group-btn'>"+
                        "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
                        "&nbsp;<span class='caret'></span>"+
                        "</button>"+
                        "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
                        "</ul>"+
                        "</div>"+
                        "</div>"+
                        "班级：" +
                        "<input type='text'  class='form-control 'id='aClassInputC"+id+"' name='_class'>"+
                        "教室：" +
                        "<div class='input-group' >"+
                        "<input type='text' class='form-control'id='classroomInputC"+id+"' name='classroom'>"+
                        "<div class='input-group-btn'>"+
                        "<button type='button' class='btn btn-default dropdown-toggle' data-toggle='dropdown' aria-expanded='false'>"+
                        "&nbsp;<span class='caret'></span>"+
                        "</button>"+
                        "<ul class='dropdown-menu dropdown-menu-left' role='menu'>"+
                        "</ul>"+
                        "</div>"+
                        "</div>"+
                        "<input id='change-sure"+id+"' class='btn btn-primary' type='button' value='确定'/>" +
                        "<input id='change-cal"+id+"'  class='btn btn-primary' type='button' value='取消'/>"+
                        "</form>");
                    let idtd=$("#r"+id);
                    idtd.html(td);
                    let courseInput=$("#courseInputC"+id);
                    courseInput.val(record.course);
                    let teacherInput=$("#teacherInputC"+id);
                    teacherInput.val(record.teacher);
                    teacherInput.bsSuggest({
                        url: "searchKeyWord?keyI=teacher&keyWord=",
                        keyField: "teacher",
                    });
                    let aClassInput=$("#aClassInputC"+id);
                    aClassInput.val(record._class);
                    aClassInput.attr("readonly",true);
                    let classroomInput=$("#classroomInputC"+id);
                    classroomInput.val(record.classroom);
                    classroomInput.bsSuggest({
                        url: "searchKeyWord?keyI=classroom&keyWord=",
                        keyField: "classroom",
                    });
                    $("#change-sure"+id).on("click",function(){
                        let formData=$("#form-change"+id).serializeArray();
                        formData.push({"name":"id","value":id});
                        $.ajax({
                            type:"post",
                            url:"modifyRecord",
                            dateType:"json",
                            data:formData,
                            success:function(data){
                                if(data.code===0){
                                    layer.msg(data.msg,{icon:1,time:1000},function () {
                                        let td=$("<span>" +
                                            "课程名称："+formData[0].value+"<br>"+
                                            "任课教师：" +formData[1].value+"<br>"+
                                            "班级：" +formData[2].value+"<br>"+
                                            "教室：" +formData[3].value+"<br>"+
                                            "</span>" +
                                            "<c:if test='${op==0}'>"+
                                            "<c:if test='${fn:contains(sessionScope.permissions,"修改课程")}'>" +
                                            "<button  class='heihei btn btn-primary' onclick='changeCell("+id+")'>修改</button>" +
                                            "</c:if>" +
                                            "<c:if test='${fn:contains(sessionScope.permissions,"移除课程")}'>" +
                                            "<button  class='heihei btn btn-primary' onclick='removeCell("+id+")'>移除</button>"+
                                            "</c:if>" +
                                            "</c:if>"+
                                            "<c:if test='${fn:contains(sessionScope.permissions,"调整课程")}'>" +
                                            "<button class='heihei btn btn-primary' onclick='adjustCell("+id+")'>调整</button>" +
                                            "</c:if>"
                                        );
                                        idtd.html(td);
                                    });
                                }
                            }
                        })
                    });
                    $("#change-cal"+id).on("click",function(){
                        let td=$("<span>" +
                            "课程名称："+record.course+"<br>"+
                            "任课教师：" +record.teacher+"<br>"+
                            "班级：" +record._class+"<br>"+
                            "教室：" +record.classroom+"<br>"+
                            "</span>"+
                            "<c:if test='${op==0}'>"+
                            "<c:if test='${fn:contains(sessionScope.permissions,"修改课程")}'>" +
                            "<button  class='heihei btn btn-primary' onclick='changeCell("+id+")'>修改</button>" +
                            "</c:if>" +
                            "<c:if test='${fn:contains(sessionScope.permissions,"移除课程")}'>" +
                            "<button  class='heihei btn btn-primary' onclick='removeCell("+id+")'>移除</button>"+
                            "</c:if>" +
                            "</c:if>"+
                            "<c:if test='${fn:contains(sessionScope.permissions,"调整课程")}'>" +
                            "<button class='heihei btn btn-primary' onclick='adjustCell("+id+")'>调整</button>" +
                            "</c:if>");
                        idtd.html(td);
                    });
                }
            }
        });
    }
    function removeCell(id){
        $.ajax({
            type:"post",
            url:"removeRecord",
            dataType:"json",
            data:{id:id},
            success:function(data){
                if(data.code===0){
                    layer.msg(data.msg,{icon:1,time:1000},function () {
                        let idtd=$("#r"+id);
                        $(idtd).html(
                            <c:if test="${op==0 and fn:contains(sessionScope.permissions, '添加课程')}">
                            "<button  onclick='addCell("+data.i+","+data.j+")'  class='heihei btn btn-primary'>增加</button>"
                            </c:if>
                        );
                        $(idtd).attr("id",data.j*7+data.i);
                    });
                }
            }
        });
    }
    function adjustCell(id){
        let td=$("<form id='form-adjust"+id+"'>" +
            "<input type='date' class='form-control' name='date'>" +
            "<select name='index' class='form-control'>" +
            "<option value='0'>1</option>" +
            "<option value='1'>2</option>" +
            "<option value='2'>3</option>" +
            "</select>" +
            "<input id='adjust-sure"+id+"' type='button' class='btn btn-primary' value='确定'>" +
            "<input id='adjust-cal"+id+"' type='button' class='btn btn-primary' value='取消'>"+
            "</form>");
        let tdtd=$("#r"+id);
        tdtd.html(td);
        $("#adjust-sure"+id).on("click",function(){
            let formData =new FormData();
            let f=$("#form-adjust"+id).serializeArray();
            let dateStr=f[0].value;
            let date=new Date();
            let datestrstr="";
            datestrstr+=date .getFullYear(); //获取完整的年份(4位)
            datestrstr+="-"+date .getMonth(); //获取当前月份(0-11,0代表1月)
            datestrstr+="-"+date .getDate(); //获取当前日(1-31)
            console.log(datestrstr);
            if(dateStr<=datestrstr){
                layer.msg("只能往后调课");
                return;
            }
            let index=f[1].value;
            formData.append("date",dateStr);
            formData.append("index",index);
            formData.append("id",id);
            console.log(formData);
            $.ajax({
                type:'post',
                url:'adjustRecord',
                processData:false,
                contentType:false,
                dataType:'json',
                data:formData,
                success:function(data){
                    if(data.code===0){
                        layer.msg(data.msg,{icon:1,time:1000},function () {
                            let ti=null;
                            $("#week>td").each(function(i,e){
                                if($(e).text()===dateStr){
                                    ti=$(e).attr("value");
                                    return false;
                                }
                            });
                            if(ti!=null){
                                let record=data.record;
                                let td=$("<span>" +
                                    "课程名称："+record.course+"<br>"+
                                    "任课教师：" +record.teacher+"<br>"+
                                    "班级：" +record._class+"<br>"+
                                    "教室：" +record.classroom+"<br>"+
                                    "</span>" +
                                    "<c:if test='${op==0}'>"+
                                    "<c:if test='${fn:contains(sessionScope.permissions,"修改课程")}'>" +
                                    "<button  class='heihei btn btn-primary' onclick='changeCell("+id+")'>修改</button>" +
                                    "</c:if>" +
                                    "<c:if test='${fn:contains(sessionScope.permissions,"移除课程")}'>" +
                                    "<button  class='heihei btn btn-primary' onclick='removeCell("+id+")'>移除</button>"+
                                    "</c:if>" +
                                    "</c:if>"+
                                    "<c:if test='${fn:contains(sessionScope.permissions,"调整课程")}'>" +
                                    "<button class='heihei btn btn-primary' onclick='adjustCell("+id+")'>调整</button>" +
                                    "</c:if>");
                                let tdx=$("#"+(index*7+parseInt(ti)));
                                console.log(tdx);
                                tdx.html(td);
                                tdx.attr('id',"r"+id);
                            }
                            tdtd.html("<button  onclick='addCell("+data.i+","+data.j+")'  class='heihei btn btn-primary'>增加</button>");
                            tdtd.attr('id',data.j*7+data.i);
                        });
                    }
                }
            });
        });
        $("#adjust-cal"+id).on("click",function(){
            $.ajax({
                url:'getRecord',
                type:'post',
                dataType:'json',
                data:{
                    id:id,
                },
                success:function(data){
                    if(data.code===0) {
                        let record=data.record;
                        let td=$("<span>" +
                            "课程名称："+record.course+"<br>"+
                            "任课教师：" +record.teacher+"<br>"+
                            "班级：" +record._class+"<br>"+
                            "教室：" +record.classroom+"<br>"+
                            "</span>"+
                            "<c:if test='${op==0}'>"+
                            "<c:if test='${fn:contains(sessionScope.permissions,"修改课程")}'>" +
                            "<button  class='heihei btn btn-primary' onclick='changeCell("+id+")'>修改</button>" +
                            "</c:if>" +
                            "<c:if test='${fn:contains(sessionScope.permissions,"移除课程")}'>" +
                            "<button  class='heihei btn btn-primary' onclick='removeCell("+id+")'>移除</button>"+
                            "</c:if>" +
                            "</c:if>"+
                            "<c:if test='${fn:contains(sessionScope.permissions,"调整课程")}'>" +
                            "<button class='heihei btn btn-primary' onclick='adjustCell("+id+")'>调整</button>" +
                            "</c:if>");
                        tdtd.html(td);
                    }
                }
            });

        });
    }
</script>
